QoDesk.QoAdmin.ColumnNodeUI = Ext.extend(Ext.tree.TreeNodeUI, {
   focus: Ext.emptyFn, // prevent odd scrolling behavior

   renderElements : function(n, a, targetNode, bulkRender){
      this.indentMarkup = n.parentNode ? n.parentNode.ui.getChildIndent() : '';

      var t = n.getOwnerTree();
      var cols = t.columns;
      var bw = t.borderWidth;
      var c = cols[0];
        
      // adds inactive class to the column tree based on the nodes active attribute
      var inactiveCls = '';
      if(n.attributes.active != 'undefined' && n.attributes.active == false){
         inactiveCls = 'qo-admin-inactive';
      }
      
      var buf = [
         '<li class="x-tree-node"><div ext:tree-node-id="',n.id,'" class="x-tree-node-el x-tree-node-leaf ', a.cls,'">',
            '<div class="x-tree-col" style="width:',c.width-bw,'px;">',
               '<span class="x-tree-node-indent">',this.indentMarkup,"</span>",
               '<img src="', this.emptyIcon, '" class="x-tree-ec-icon x-tree-elbow">',
               '<img src="', a.icon || this.emptyIcon, '" class="x-tree-node-icon',(a.icon ? " x-tree-node-inline-icon" : ""),(a.iconCls ? " "+a.iconCls : ""),'" unselectable="on">',
               '<a hidefocus="on" class="x-tree-node-anchor" href="',a.href ? a.href : "#",'" tabIndex="1" ',
               a.hrefTarget ? ' target="'+a.hrefTarget+'"' : "", '>',
               '<span class="', inactiveCls ,'" unselectable="on">', n.text || (c.renderer ? c.renderer(a[c.dataIndex], n, a) : a[c.dataIndex]),"</span></a>",
            "</div>"
      ];
                
      for(var i = 1, len = cols.length; i < len; i++){
         c = cols[i];

         buf.push('<div class="x-tree-col ',(c.cls?c.cls:''),'" style="width:',c.width-bw,'px;">',
            '<div class="x-tree-col-text ', inactiveCls ,'">',(c.renderer ? c.renderer(a[c.dataIndex], n, a) : a[c.dataIndex]),"</div>",
            "</div>"
         );
      }
      
      buf.push('<div class="x-clear"></div></div>', '<ul class="x-tree-node-ct" style="display:none;"></ul>', "</li>");

      if(bulkRender !== true && n.nextSibling && n.nextSibling.ui.getEl()){
         this.wrap = Ext.DomHelper.insertHtml("beforeBegin", n.nextSibling.ui.getEl(), buf.join(""));
      }else{
         this.wrap = Ext.DomHelper.insertHtml("beforeEnd", targetNode, buf.join(""));
      }

      this.elNode = this.wrap.childNodes[0];
      this.ctNode = this.wrap.childNodes[1];
      var cs = this.elNode.firstChild.childNodes;
      this.indentNode = cs[0];
      this.ecNode = cs[1];
      this.iconNode = cs[2];
      this.anchor = cs[3];
      this.textNode = cs[3].firstChild;
   }
});